<%--
  Created by IntelliJ IDEA.
  User: pc
  Date: 2025/9/2
  Time: 10:14
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>Title</title>
    <link href="./statics/layui/css/layui.css" rel="stylesheet">
</head>

<body>
    <script type="text/html" id="toolbarDemo">
        <c:forEach var="btn" items="${sessionScope.menusBtn}" varStatus="s">
            ${btn.hrefUrl}
        </c:forEach>
    </script>
    <table class="layui-hide"  id="test" lay-filter="test"></table>
</body>

<script src="./statics/layui/layui.js"></script>
<script>
    layui.use('table', function(){
        var table = layui.table;
        var $ = layui.jquery;
        var layer = layui.layer;
        // 已知数据渲染
        var inst = table.render({
            elem: '#test',
            url:"/user?type=getUserTableAll",
            toolbar:"#toolbarDemo",
            cols: [[ //标题栏
                {type: 'checkbox', fixed: 'left'},
                {field: 'id', title: 'ID', width: 80, sort: true},
                {field: 'name', title: '用户', width: 120},
                {field: 'password', title: '密码', minWidth: 160}
            ]],
            skin: 'line', // 表格风格
            even: true,
            page: true, // 是否显示分页
            limits: [5, 10, 15],
            limit: 5 // 每页默认显示的数量
        });

        //工具栏绑定
        table.on('toolbar(test)', function(obj){
            var id = obj.config.id;
            var checkStatus = table.checkStatus(id);
            switch(obj.event){
                case 'delUser':
                    let row=checkStatus.data;
                    if(row>1 || row<=0){
                        layer.alert("只能操作一行");
                        return;
                    }
                    delUser(row[0].id);
                    break;
                case 'editUser':
                    let row1=checkStatus.data;
                    if(row1>1 || row1<=0){
                        layer.alert("只能操作一行");
                        return;
                    }
                    editUser(row1[0].id)
                    break;
                case 'addUser':
                    addUser()
                    break;
            };
        });

        //删除
        function delUser(uid) {
         layer.confirm("是否要删除编号为["+uid+"]的数据",["确认","取消"],function () {
             $.ajax({
                 url:"/user?type=delUser&&id="+uid,
                 type:"GET",
                 dataType:"json",
                 success:function (res) {
                     if(res.state==200){
                         layer.msg("删除成功",{icon:1})
                         setTimeout(function () {
                             table.reload("test");
                         },1000)
                     }else {
                         layer.alert(res.msg);
                     }
                 }
             })
         },function () {
                  layer.msg("取消删除")
         })

      }

      //修改
        function editUser(uid) {
            // 在此处输入 layer 的任意代码
           let inde= layer.open({
                type: 2, // page 层类型
                area: ['500px', '300px'],
                title: '修改',
                shade: 0.6, // 遮罩透明度
                shadeClose: true, // 点击遮罩区域，关闭弹层
                maxmin: true, // 允许全屏最小化
                anim: 0, // 0-6 的动画形式，-1 不开启
                content: '/user?type=getUserById&&id='+uid
            });
        }

        //新增
        function addUser() {
            // 在此处输入 layer 的任意代码
            layer.open({
                type: 2,
                area: ['500px', '300px'],
                title: '新增',
                shade: 0.6, // 遮罩透明度
                shadeClose: true, // 点击遮罩区域，关闭弹层
                maxmin: true, // 允许全屏最小化
                anim: 0, // 0-6 的动画形式，-1 不开启
                content: 'addUser.jsp'
            });
        }
    });
</script>
</html>
